<template>
	<view class="add">

		<view class="box" style="padding-top: 50rpx;">
			<view class="item">
				<view>开户姓名 <span>*</span></view>
				<view>
					<input type="text" v-model="username" />
				</view>
			</view>
			<view class="item">
				<view>银行卡号 <span>*</span></view>
				<view>
					<input type="text" v-model="cardbh" />
				</view>
			</view>
			<view class="item"  @click="showSinglePicker">
				<view>开户银行 <span>*</span></view>
				<view>
					<span style="padding-left: 20rpx; color: #9f9f9f;">{{ bank }}</span>
				</view>
			</view>
			<view class="item">
				<view>开户支行  <span>*</span></view>
				<view>
					<input v-model="bankzhi" type="text" />
				</view>
			</view>
			<view class="item">
				<view>每单最大 </view>
				<view>
					<input v-model="danmax"  type="number" />
				</view>
			</view>
			<view class="item">
				<view>每单最小 </view>
				<view>
					<input v-model="danmin"  type="number" />
				</view>
			</view>
			<view class="item">
				<view>每天最大 </view>
				<view>
					<input v-model="daymax"  type="number" />
				</view>
			</view>
		</view>
		<view class="tip1">
			<view>请认真核对银行卡信息</view>
		</view>
		<view class="tijiao" @tap="tijiao()">确认银行卡</view>
		<mpvue-picker
			:themeColor="themeColor"
			ref="mpvuePicker"
			:mode="mode"
			:deepLength="deepLength"
			:pickerValueDefault="pickerValueDefault"
			@onConfirm="onConfirm"
			@onCancel="onCancel"
			:pickerValueArray="pickerValueArray"
		></mpvue-picker>
	</view>
</template>

<script>
	import { mapState } from 'vuex';
		import tuiIcon from "@/components/icon/icon"
		import mpvuePicker from '@/components/mpvue-picker/mpvuePicker.vue';
	export default {
		components: {
			tuiIcon,
			mpvuePicker
			
		},
		computed: mapState({
			getbank: 'getbank',
			userinfo: 'userinfo'
		}),
		data() {
			return {
				 files: [] ,//最多上传9张图片，
				 	bank: '',
				 themeColor: '#007AFF',
				 mode: 'selector',
				 deepLength: 1,
				 pickerValueDefault: [0],
				 PickerIndex: 1,
				 bankid: '',
				 pickerValueArray: [],
				 cardbh:'',
				 username:'',
				 qrcode_id:'',
				 danmax:'',
				 danmin:'',
				 daymax:'',
				 bankzhi:''
				 
			}
		},
		methods: {
				tijiao(){
				
				if (this.username == '' || this.cardbh == '' || this.bankid==''||this.bankzhi == '') {
					uni.showToast({
						title: '信息不能为空',
						icon: 'none'
					});
				}
				 else{
					 var cardbh = this.cardbh.replace(/\s*/g,"");
					 var  username =this.username.replace(/\s*/g,"");
					 // this.cardbh.replace(/\s*/g,"");
					 var data={
						  token: uni.getStorageSync('token'),
						 ploatform_id:7,
						 nickname:username,
						 account:cardbh,
						 bank_id:this.bankid,
						 qrcode_id:this.qrcode_id,
						 single_max:this.danmax,
						 single_min:this.danmin,
						 total_max:this.daymax,
						 bank_khh:this.bankzhi
						
			
					 }
					 this.$store
					 	.dispatch('editqrcode', data)
					 	.then(res => {
					 		uni.showToast({
					 			title: res.data.msg,
					 			icon: 'none'
					 		});
							if(res.data.code==1){
								var data = {
									token: uni.getStorageSync('token')
								};
								
								this.$store.dispatch('qrcodelist', data);
								uni.navigateBack({
								    delta: 1
								});
							}
					   })
					 // addqrcode
					
				 }
			},
			 chooseImage: function (e) {
					let that = this;
					if (that.files.length >=1) {
						this.tui.toast("最多上传1张图片");
						return
					}
					wx.chooseImage({
						count: 9 - that.files.length,
						sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
						sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
						success: function (res) {
							// 返回选定照片的本地文件路径列表，tempFilePath可以作为img标签的src属性显示图片
							that.files=that.files.concat(res.tempFilePaths)
							//上传功能已去除
							//...
						}
					})
				},
				previewImage: function (e) {
					uni.previewImage({
						current: e.currentTarget.id, // 当前显示图片的http链接
						urls: this.files // 需要预览的图片http链接列表
					})
				},
				deleteImage: function (e) {
					const index = e.index;
					this.files.splice(index, 1);
				},
				onCancel(e) {
					
				},
				showSinglePicker(val) {
					this.PickerIndex = val * 1;
					this.mode = 'selector';
					
					this.$refs.mpvuePicker.show();
				},
				onConfirm(e) {
					this.bank = JSON.parse(JSON.stringify(e)).label;
					this.bankid = JSON.parse(JSON.stringify(e)).value[0];
					
				}
		},
		onLoad(e) {
			this.username = e.nickname;
			this.cardbh = e.account;
			this.qrcode_id = e.qrcode_id;
			this.danmax = e.single_max;
			this.danmin = e.single_min;
			this.daymax = e.total_max;
			this.bankzhi = e.bank_khh
			
			
			var data = {
				token: uni.getStorageSync('token')
			};
			this.$store.dispatch('getbank', data).then(() => {
				this.pickerValueArray = this.getbank;
				this.bankid = e.bankid;
				setTimeout(() => {
					for (var i = 0; i < this.getbank.length; i++) {
						if (this.bankid == this.getbank[i]['value']) {
							this.bank = this.getbank[i]['label']
							// this.bankid = this.getbank[i]['value'];
							return;
						}
					}
				}, 100);
			});
			
		}
	}
</script>
<style lang="scss" scoped src="./index.scss"></style>
